<?php
@ob_start();
@session_start();
error_reporting (E_ALL ^ E_NOTICE);	

require_once("../../includes/GPSFunction.php");
require("../user/checkSession.php");
require("../../includes/config.inc.php"); 
require("../../includes/Database.class.php"); 

include("../user/Util.php"); 
$util =  new Util();

$db = new Database(DB_SERVER, DB_USER, DB_PASS, DB_DATABASE); 
$db->connect(); 

$getUserInfo = "SELECT * FROM tb_userinfo,tb_clientinfo WHERE ui_id  = ".$_SESSION[userID]." AND ci_id = ".$_SESSION[clientID];
$resUserInfo = $db->query($getUserInfo);
if($db->affected_rows > 0)
{
	$recordUserInfo = $db->fetch_array($resUserInfo);
	
	if($recordUserInfo[ci_clientId]!=0)
	{
		$getResellInfo = "SELECT ci_clientName,ci_clientLogo,ci_footerText FROM tb_clientinfo WHERE ci_id = ".$recordUserInfo[ci_clientId];
		$resResellInfo = $db->query($getResellInfo);
		if($db->affected_rows > 0){
			$fetResellInfo = $db->fetch_array($resResellInfo);
			$clientLogo = $fetResellInfo[ci_clientLogo];
			$clientOrgName = $fetResellInfo[ci_clientName];
			$clientFooter = $fetResellInfo[ci_footerText];
		}
		else
		{
			$clientOrgName = $recordUserInfo[ci_clientName];
			$clientLogo = $recordUserInfo[ci_clientLogo];
			$clientFooter = $recordUserInfo[ci_footerText];
		}
	}
	else
	{
		$clientOrgName = $recordUserInfo[ci_clientName];
		$clientLogo = $recordUserInfo[ci_clientLogo];
		$clientFooter = $recordUserInfo[ci_footerText];
	}
	$welcomeTxt = '';
	if($recordUserInfo[ui_isAdmin] == 1)
	{
		$welcomeTxt = 'Admin';
	}
	elseif($recordUserInfo[ui_roleId])
	{
		
		$welcomeTxt = $util->getRoleNameOfUserByRoleId($recordUserInfo[ui_roleId]);
	}
	if($recordUserInfo[ci_clientType] == "Reseller")
	{
		$getDevice = "SELECT ci_id,ci_clientName FROM tb_deviceinfo,tb_clientinfo,tb_client_subscription WHERE tcs_deviceId = di_id AND di_status = 1 AND tcs_isActive = 1 AND di_clientId = ci_id AND ci_clientId=".$_SESSION[clientID]." group by ci_clientName";
	
		$resDevice= $db->query($getDevice);	
		if($db->affected_rows > 0)
		{
			$option = '<ul id="menu3">';
			while ($fetDevice = $db->fetch_array($resDevice)) 
			{
				$renewDate = date("d-m-Y",strtotime("-1 days ".($fetDevice[tcs_noOfMonths]) ."months ".$fetDevice[tcs_renewalDateFrom]));
				if(strtotime($date_offline) <= strtotime($renewDate))
				{
					//$option .= '<option value="'.$fetDevice[ci_id].'#'.$fetDevice[ci_clientName].'">'.$fetDevice[ci_clientName].'</option>';
					$option .= '<li><a href="#" onclick=loadClientDevice("'.$fetDevice[ci_id].'#'.ucfirst(str_replace(" ","_",$fetDevice[ci_clientName])).'");>'.ucfirst($fetDevice[ci_clientName]).'</a></li>';
				}
			}
			$option .= '</ul>';
			//echo $option;
		}
	}
}

//echo '<pre>';
//print_r($_POST);
//echo '</pre>';
if($_POST[txtVehino] != '' && $_POST[txtDate] != '' && $_POST[txtSessId] != '' && $_POST[txtRunFlag] != '' && $_POST[txtFromTime] != '' && $_POST[txtToTime] != '' )
{
	$_POST[date_offline] = $_POST[txtDate];
}
//exit;
if(isset($_POST[date_offline]) && $_POST[date_offline])
	$date_offline = $_POST[date_offline];
else
	$date_offline = date('d-m-Y');

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php echo $clientOrgName;?> :: GPS Application</title>
<link href="../../images/fav-icon.gif" rel="icon" />
<!--<link href="../../css/style.css" rel="stylesheet" type="text/css" />
<link href="css/mapCss.css" rel="stylesheet" type="text/css" />
-->
<style type="text/css" media="all">@import "../../css/timePicker.css";</style>

<LINK rel="stylesheet" type="text/css" href="../../css/themes/base/jquery.ui.all.css">
<LINK rel="stylesheet" type="text/css" href="css/mapLayout.css">

<script language="javascript" src="javascript/ajax.js"></script>
<script src="http://maps.google.com/maps?file=api&amp;v=2.x&amp;key=<?php echo GOOGLE_API_KEY;?>" type="text/javascript"></script>
 <script type="text/javascript">
    document.write('<script type="text/javascript" src="js/extlargemapcontrol'+(document.location.search.indexOf('packed')>-1?'_packed':'')+'.js"><'+'/script>');
  </script>

<script type="text/javascript">
      document.write('<script type="text/javascript" src="js/markerclusterer' + (document.location.search.indexOf('packed') > -1 ? '_packed' : '') + '.js"><' + '/script>');
    </script>
<script src="../../javascript/elabel.js" type="text/javascript"></script>


<SCRIPT type="text/javascript" src="js/jquery-latest.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/jquery-ui-latest.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/jquery.layout-latest.js"></SCRIPT>

<SCRIPT type="text/javascript" src="js/jquery.layout.resizeTabLayout.min-1.1.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/jquery.layout.resizePaneAccordions.min-1.0.js"></SCRIPT>

<SCRIPT type="text/javascript" src="js/mapLayout.js"></SCRIPT>
<script type="text/javascript" src="js/timePicker.js"></script>

<script src="javascript/maps_off.js" type="text/javascript"></script>
<script src="javascript/MapScript.js" type="text/javascript"></script>

<script type="text/javascript" src="js/jquery.speedometer.js"></script>
<script type="text/javascript" src="js/excanvas.js"></script>


<script type="text/javascript" src="gauage/js/raphael.js"></script>
<script type="text/javascript" src="gauage/js/gauge.js"></script>


</HEAD> 
<BODY class="custom" onLoad="loadMap('<?php echo $date_offline;?>','<?php echo $_SESSION[clientID];?>','<?php echo $_POST[txtSessId];?>','<?php echo $_POST[txtVehino];?>','<?php echo $_POST[txtRunFlag];?>','<?php echo $_POST[txtFromTime];?>','<?php echo $_POST[txtToTime];?>')" onUnload="GUnload()"> 
<form name="frmMapData" id="frmMapData">
<input type="hidden" name="hidTxtDevId" id="hidTxtDevId" />
<DIV id="outer-north">	
	<DIV class="buttons"> 
	<table class="gridform_final" style="width:100%">
	  <tr><th width="23%">Start Date & Time</th><th width="23%">End Date & Time</th><th>Find</th><th>Play/Pause</th><th>Stop</th><th>Anim Speed</th><th>Refresh</th><th>Go To</th></tr>
      <tr>
        <td><input type="text" name="from_date" id="from_date" size="12%" value="<?php echo $date_offline;?>" />
			<span><input type="text" readonly="readonly" id="time3" size="7" value="00:01"s style="width:15%" /></span>
		</td>
        <td><input type="text" name="to_date" id="to_date" size="12%" value="<?php echo $date_offline;?>" />
			<span><input type="text" id="time4" size="7" readonly="readonly" value="23:59" style="width:15%" /></span>
		</td>	  	
		<td align="left">
        <input type="button" name="cmdFindData" id="cmdFindData" value="Find" disabled="disabled" onClick="showMapOnDate(document.getElementById('from_date').value,document.getElementById('time3').value,document.getElementById('to_date').value,document.getElementById('time4').value,document.getElementById('hidTxtDevId').value);" class="btnFindNACSS" />
          </td>
		 <td><img src="images/icons/d_play.png" id="cmdPlay" style="cursor:pointer;vertical-align:bottom" width="22" height="22" border="0" alt="t_Play" onClick="playAnimation(this)" /></td>       
		 <td><img src="images/icons/d_stop.png" id="cmdStop" style="cursor:pointer; vertical-align:bottom" width="22" height="22" border="0" alt="t_Stop" onClick="stopAnimation(this)" /></td> 
		 <td>
          <select name="selBubbleInter" id="selBubbleInter" disabled="disabled" onChange="showBubbleInterval(this.value)">
            <option value=1 selected=selected >10 x</option><option value=2>9 x</option><option value=3>8 x</option><option value=4>7 x</option><option value=5>6 x</option><option value=6>5 x</option><option value=7>4 x</option><option value=8>3 x</option><option value=9>5 x</option><option value=10>1 x</option>
          </select>
          </td>        
		<td><select name="selectRefresh" id="selectRefresh" disabled="disabled" tabindex="3" onChange="autoRefresh1();">
          <option value ="0">Refresh - Off</option>
          <option value ="10">Refresh - 10 secs</option>
          <option value ="20">Refresh - 20 secs</option>
          <option value ="30">Refresh - 30 secs</option>
          <option value ="40">Refresh - 40 secs</option>
          <option value ="50">Refresh - 50 secs</option>
          <option value ="60">Refresh - 1 minute</option>
       </select>
	   </td>
	   <td><input type="button" name="showAll" class="showlive_off" id="showAll" value="Show Live" onClick="showMapForDate('<?php echo $date_offline;?>')" /></td>
	  </tr>
    </table>
		<!--<BUTTON onClick="toggleCustomTheme()">Toggle Custom Theme</BUTTON>
		<BUTTON onClick="removeUITheme(); resizePageLayout()">Remove UI Theme</BUTTON>
		<BUTTON onClick="resizePageLayout()">Resize Layout</BUTTON>-->
	</DIV>
	
	<img src="../client_logo/<?php echo $clientLogo;?>" style="width:165px;height:55px;" />
</DIV>

<DIV id="page-loading">Loading...</DIV>

<!--<DIV id="outer-south" class="hidden">Outer-South Pane</DIV>-->
<DIV id="outer-center" class="hidden">

	<UL style="display:none;">
		<LI class="tab1"><A href="#tab1">Outer Tab One</A></LI>
	</UL>

	<DIV id="tabpanels">

		<DIV id="tab1" class="tab-panel ui-tabs-hide">
			<DIV class="ui-layout-north ui-widget">
				<DIV class="toolbar ui-widget-content ui-state-active" id="messages" style="display:none;">
					Loading...
				</DIV>
			</DIV>
			<DIV class="ui-layout-south ui-widget">
				<DIV class="toolbar ui-widget-content ui-state-default">

					<?php echo $clientFooter;?>
				</DIV>
			</DIV>
			<DIV class="ui-layout-center">
				<DIV class="ui-widget-header ui-corner-top">Map</DIV>
				<DIV id="map_canvas" class="ui-widget-content">
				</DIV>
<!--				<DIV class="ui-widget-footer ui-widget-header ui-corner-bottom">&nbsp;</DIV>
-->			</DIV>
			<DIV class="ui-layout-west">
<?php if($recordUserInfo[ci_clientType] == "Reseller") { ?>
<DIV class="ui-layout-north">
	<DIV class="ui-widget-header ui-corner-top" id="clListHead">Client List</DIV>
	<DIV class="ui-widget-content">
		 <?php echo $option;?>
	</DIV>
	<!--<DIV class="ui-widget-footer ui-widget-header ui-corner-bottom">&nbsp;</DIV>-->
</DIV>
<?php }?>
<DIV class="ui-layout-center">
	<DIV class="ui-widget-header ui-corner-top">Device List</DIV>
	<DIV class="ui-widget-content" id="mapTable">

	</DIV>
    
	<!--<DIV class="ui-widget-footer ui-widget-header ui-corner-bottom">&nbsp;</DIV>-->
</DIV>

</DIV>

<DIV class="ui-layout-east">
<DIV class="ui-layout-center">

	<DIV class="ui-widget-header ui-corner-top">Parameters</DIV>
	<DIV class="ui-widget-content">
    <p>
		<table class="param_grid_final" id="paramTable">
            <tr><td>Choose A Device</td></tr>                    
        </table>
    </p>
    <p class="thHead">Speedometer
        <div id="speedMeter" style="margin-left:4%"></div>
    </p>
	
	  
      <p class="thHead">Direction
         <div style="background:transparent url('images/comprose.gif') center top no-repeat; height:150px;">
            <img id='binnacle' src='images/binnacle_s.png' style=" position:relative; top:19%; left:25.5%;" height="90">
         </div>
       </p>        
	</DIV>
	<!--<DIV class="ui-widget-footer ui-widget-header ui-corner-bottom">&nbsp;</DIV>-->

</DIV>

<!--<DIV class="ui-layout-south">
	<DIV class="ui-widget-header ui-corner-top">East-South</DIV>
	<DIV class="ui-widget-content">
		
	</DIV>
	<DIV class="ui-widget-footer ui-widget-header ui-corner-bottom">&nbsp;</DIV>
</DIV>-->
    </DIV>
</DIV><!-- /#tab1 -->


</DIV><!-- /#tabpanels -->

</DIV><!-- /#outer-center -->
<div id="sampleformdiv1" class="hidePopDiv" title="Track History">
  
   </div>
</form>
<div class="devSpeedMeter">
<table>
	<tr>
        <td>        
        	            
        </td>
        <td>
        	
            
        </td>
    </tr>
</table>
	
</div>
<canvas id="arrowcanvas" width="32" height="32"></canvas>
</BODY>
</HTML>
<script type="text/javascript">
//<![CDATA[
var myLayout; // a var is required because this page utilizes: myLayout.allowOverflow() method
//var fuelGauge;
var activeTab;
function  openFind() {
	  $("#sampleformdiv1").dialog({
			modal: true
		});
}
/*fuelGauge = new Fuel("fuel1");

	//Default Action
	$(".tab_content").hide(); //Hide all content
	$("ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content:first").show(); //Show first tab content
	
	//On Click Event
	$("ul.tabs li").click(function() {
		$("ul.tabs li").removeClass("active"); //Remove any "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content").hide(); //Hide all tab content
		activeTab = $(this).find("a").attr("href"); //Find the rel attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active content
		return false;
	});
	
	$('#test').speedometer(0);
	
	//
	
	
   $("#open_btn").click(function () {
      $("#sampleformdiv").show();
   });
  

	//fuelGauge.SetFuel(75);
});*/
function closePopDiv(div)
{
	$("#"+div).hide();
}
$(function() {
	$( "#from_date" ).datepicker({
		changeMonth: true,
		changeYear: true,
		maxDate: 0,
		showOn: "button",
		buttonImage: "images/calendar.gif",
		buttonImageOnly: true,
		dateFormat : "dd-mm-yy"
	});
});
$(function() {
	$( "#to_date" ).datepicker({
		changeMonth: true,
		changeYear: true,
		maxDate: 0,
		showOn: "button",
		buttonImage: "images/calendar.gif",
		buttonImageOnly: true,
		dateFormat : "dd-mm-yy"
	});
});
$(function() 
{
    // Use default settings
    //$("#time3, #time4").timePicker();
	 $("#time3, #time4").timePicker({
	  startTime: "00:01", // Using string. Can take string or Date object.
	  endTime: "23:59", // Using Date object here.
	  show24Hours: true,
	  separator: ':',
	  step: 1});    
        
    // Store time used by duration.
    var oldTime = $.timePicker("#time3").getTime();
    
    // Keep the duration between the two inputs.
    $("#time3").change(function() {
      if ($("#time4").val()) { // Only update when second input has a value.
        // Calculate duration.
        var duration = ($.timePicker("#time4").getTime() - oldTime);
        var time = $.timePicker("#time3").getTime();
        // Calculate and update the time in the second input.
        $.timePicker("#time4").setTime(new Date(new Date(time.getTime() + duration)));
        oldTime = time;
      }
    });
    // Validate.
    $("#time4").change(function() {
      if($.timePicker("#time3").getTime() > $.timePicker(this).getTime()) {
        $(this).addClass("error");
      }
      else {
        $(this).removeClass("error");
      }
    });
    
});
function loadClientDevice(clientID)
{
	$("#panel1 .panelHead").html("Loading...");
	val = clientID.split("#")
	clientId = val[0];
	clientName = val[1];
	document.getElementById('mapTable').innerHTML = "Getting list for ...<br />"+clientName;
	map.clearOverlays();
	tmpNdiv = '';
	$('td#ctSpd').text("N/A");
	$('td#dateTime').text("N/A");
	$('td#posLatPt').text("N/A");
	$('td#posLongPt').text("N/A");
	$('td#posAltPt').text("N/A");
	//$('td#noSate').text("N/A");
	$('td#Engine').text("N/A");
	$('td#AC').text("N/A");
	$('td#Ignition').text("N/A");
	$('td#Sos').text("N/A");
	$('#test').speedometer({ percentage: 0 });
	refreshMapTable("",clientId,"<?php echo $date_offline;?>");
	getAllVehicle("<?php echo $date_offline;?>",clientId);
	//$("#clListHead").html("Client :: "+clientName);
}
//alert($("#menu3 li").length)
/*if($("#menu3 li").length >0)
	$("#clListHead").html("Client :: "+$("#menu3 li:first a").html());
$("#ui-widget-header ui-corner-top").html("Device List - "+$("#selClientId").find("option:selected").text());	
else*/
	
refreshMapTable("","<?php echo $_SESSION[clientID];?>","<?php echo $date_offline;?>");
function showMapForDate(val)
{	
	document.getElementById('mapTable').innerHTML = "Loading...";
	document.getElementById('showAll').className = 'showlive_off';
	hasMap();
	autoRefresh = 0;
	clearInterval(intervalID);
	pickThisDevice(0);
	document.getElementById('cmdPlay').value = "Play";
	document.getElementById('cmdPlay').disabled = true;
	//document.frmMapData.chkShowBubble.disabled = true;
	document.getElementById('selBubbleInter').selectedIndex = 2
	document.getElementById('selBubbleInter').disabled = true;
	if(route) clearTimeout(route);
	 stopClick = false;
	 count = 0;	
	 myMarker = "";
	//document.getElementById('map').innerHTML = "Loading...";
	$('#speedMeter').speedometer({ percentage: 0 });
	getAllVehicle(val,'<?php echo $_SESSION[clientID];?>');
	refreshMapTable("","<?php echo $_SESSION[clientID];?>",val);	
}
//]]>
</script>